<%--
  Created by IntelliJ IDEA.
  User: zekdot
  Date: 18-12-26
  Time: 下午5:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <title>加密发起者页面</title>
</head>
<body>
<div id="tip">
    <h2>用法：</h2>
    <ul>
        <li>1.点击"生成会话所需的数据"，会生成所需数据，并会自动的将要发给对方的数据复制到剪贴板中。</li>
        <li>2.将剪贴板的内容直接粘贴发给对方，并让对方到"106.14.212.49:8080/guest"这个链接去操作，生成所需要的Y</li>
        <li>3.得到对方发过来的Y之后，填入"对方的Y"对应的输入框中，然后点击"生成密钥"</li>
        <li>4-1.将要加密的明文填入"加密部分"的"明文"所对应的对话框中，并点击"加密"生成密文，密文会自动复制到剪贴板中，直接粘贴发给对方即可。</li>
        <li>4-2.如果收到了对方的密文，填入"解密部分"对应的"密文"所对应的对话框中，并点击"解密"生成明文。</li>
    </ul>

</div>
<div id="operation">
    <h1>加密发起者</h1>
    <a href="${request.getServletContext().getContextPath()}/guest">我要参与别人的加密</a>
        <h2>密钥协商部分</h2>
            <label for="p">大素数P：</label>
            <%--<input type="text" id="p">--%>
            <label id="p"></label>
            <br>
            <label for="g">生成元g：</label>
            <%--<input type="text" id="g">--%>
            <label id="g"></label>
            <br>
            <label for="x">随机数X：</label>
            <%--<input type="text" id="x">--%>
            <label id="x"></label>
            <br>
            <label for="y">随机数Y：</label>
            <%--<input type="text" id="y">--%>
            <label id="y"></label>
            <br>
            <label>生成的内容：</label>
            <input type="text" id="host_gen">
            <br>
            <button id="get_random">生成会话所需的数据</button>
            <label id="host_gen_tip" class="tip_text"></label>
            <br><br>
            <label for="yb">对方的Y：</label><input type="text" id="yb"><br>
            <label for="k">密钥K&nbsp;&nbsp;&nbsp;&nbsp;：</label>
            <%--<input type="text" id="k">--%>
            <label id="k"></label>
            <br>
            <button id="get_key">生成密钥</button><br>
        <br>
        <h2>加密部分</h2>
            <label for="plain">明文：</label><input type="text" id="plain"><br>
            <label for="cipher">密文：</label><input type="text" id="cipher"><br>
            <button id="encrypt">加密</button><label id="encrypt_tip" class="tip_text"></label><br>
        <br>
        <h2>解密部分</h2>
            <label for="cipher2">密文：</label><input type="text" id="cipher2"><br>
            <label for="plain2">明文：</label><input type="text" id="plain2"><br>
            <button id="decrypt">解密</button>
</div>

</body>
<script type="text/javascript" src="${request.getServletContext().getContextPath()}/js/BigInt.js"></script>
<script type="text/javascript" src="${request.getServletContext().getContextPath()}/js/jquery.min.js"></script>
<script type="text/javascript" src="${request.getServletContext().getContextPath()}/CryptoJS/rollups/aes.js"></script>
<script type="text/javascript" src="${request.getServletContext().getContextPath()}/CryptoJS/components/mode-ecb.js"></script>
<script type="text/javascript" src="${request.getServletContext().getContextPath()}/js/pkcs3.js"></script>

<style>
    .tip_text{
        color: red;
    }
</style>

<script type="text/javascript">

    $('#get_random').click(function(){
        $('#host_gen_tip').val('')
        let p=get_p("${prime}");	//生成p
        let q=get_q(p);	//计算q
        let g=get_g(p,q);	//计算g
        var x=get_x(32);	//生成x
        var y=get_y(g,x,p);	//生成y
        $('#p').text(biToHex(p));	//设置值
        $('#g').text(biToHex(g));
        $('#x').text(biToHex(x));
        $('#y').text(biToHex(y));
        let data={'p':biToHex(p),'g':biToHex(g),'y':biToHex(y)};
        $('#host_gen').val(JSON.stringify(data));

        var Url2=document.getElementById("host_gen");
        Url2.select(); // 选择对象
        document.execCommand("Copy"); // 执行浏览器复制命令
        $('#host_gen_tip').text("已复制好，可贴粘。");
    });

    $('#get_key').click(function(){
        if($('#p').text()==''||$('#x').text()==''||$('#yb').val()=='') {
            alert('请按照规则生成或填写相关信息');
            return ;
        }
        var P=biFromHex($('#p').text());
        var X=biFromHex($('#x').text());	//获取x
        var Yb=biFromHex($('#yb').val());	//获取yb
        var K=get_k(X,Yb,P);	//计算K
        $('#k').text(biToHex(K));
    });

    $('#encrypt').click(function(){
        if($('#k').text()==''){
            alert('请先生成Key');
            return;
        }
        var plain=$('#plain').val();	//获取明文的值
        var key=get_hex_to_char_str($('#k').text());	//获取密钥值
        var ciphertext=aes_enc(plain,key);	//计算密文
        $('#cipher').val(ciphertext);	//设置结果
        var Url2=document.getElementById("cipher");
        Url2.select(); // 选择对象
        document.execCommand("Copy"); // 执行浏览器复制命令
        $('#encrypt_tip').text('密文已复制');
    });

    $('#decrypt').click(function(){
        if($('#k').text()==''){
            alert('请先生成Key');
            return;
        }
        var ciphertext=$('#cipher2').val();	//获取密文的值
        var key=get_hex_to_char_str($('#k').text());	//获取密钥值
        var plain=aes_dec(ciphertext,key);	//计算明文
        //alert(plain)
        $('#plain2').val(plain);	//设置明文
    });
    $('#plain').focus(function () {
        $('#encrypt_tip').text('')
    })
    $('#cipher2').focus(function () {
        $('#cipher2').val('')
    })
</script>
</html>